<template>
	<div class="container">
		<el-table :data="dictList" border class="table" header-cell-class-name="table-header" @row-click="func_trClick">
			<el-table-column prop="id" label="ID" width="55" align="center" v-if="false"></el-table-column>
			<el-table-column label="序号" width="80" align="center"><template #default="scope">
					{{scope.$index+1}}
			</template></el-table-column>
			<el-table-column prop="parentId" label="父级别" align="center" v-if="false" ></el-table-column>
			<el-table-column prop="dicCode" label="字典CODE" align="center" v-if="false"></el-table-column>
			<el-table-column prop="dicName" label="字典名称" align="center"></el-table-column>
			<el-table-column prop="dicNickname" label="字典别称" align="center" v-if="false"></el-table-column>
			<el-table-column prop="remark" label="字典说明" align="center"></el-table-column>
		</el-table>
		<div class="pagination">
			<el-pagination background layout="total, prev, pager, next" :current-page="query.pageNum"
				:page-size="query.pageSize" :total="dataTotal" @current-change="func_handlePageChange"></el-pagination>
		</div>
	</div>
</template>
<script>
import { onMounted, ref, reactive, toRefs } from 'vue';
import { useRouter,useRoute } from 'vue-router';
import { ElMessage, ElMessageBox } from "element-plus";
import { findChildDictionaryListByParentId, } from "../../../api/dict";
export default {
	name: "vDict",
  	props:{
		selectValue: Number
	},
	emits: ["dictData"],
    setup(props,cex){
		const router = useRouter();
		const route = useRoute();
		const query = reactive({
			parentId: "",
			pageNum: 1,
			pageSize: 10,
		});
		const dictList = ref([]);
		const dataTotal = ref(0);
// =========================================================================================
		const func_getDictData = () => {
			query.parentId = props.selectValue;
			findChildDictionaryListByParentId(query).then((res) => {
				dictList.value = res.data.list;
				dataTotal.value = res.dataTotal;
			});
		}
        /**
         * @name 公共 分页导航
         * @description 关键词分页查询
         */
		const func_handlePageChange = (val) => {
			query.pageIndex = val;
			func_getDictData();
		};
		const func_trClick = (row, event, column) => {
			cex.emit('dictData',  {dicCode: row.dicCode,dicName:row.dicName});
		};
		const initParams = () => {
			dataTotal.value = 0;
			func_getDictData();
		};
		initParams();
        return {
			query, dictList, dataTotal, initParams,
			func_getDictData, func_handlePageChange, func_trClick,
        };
		onMounted(()=>{
		
		});
    },
};
</script>
<style scoped>

</style>
